@font-face{
	font-family:disposabledroid;
	src:url(../fonts/disposabledroid-bb.regular.ttf);
}
body{
	margin:0 0 0 0;
	padding:0;
	background-color:#b3b3b3;
	font-family:Helvetica,Arial,Sans-Serif
}
body #container{
	max-width:1100px;
	margin:0 auto;
	overflow:auto
}
body #container header{
	background-color:#333333;
	height:80px
}
body #container header .logo{
	width:600px;
	margin:0 auto;
	color:#ffffff;
	text-align:center
}
body #container header .logo h1{margin:-10px 0 0 0;font-size:3.7em;padding-top:10px}
body #container header .logo h3{margin:-15px 0 0 0;color:#b7a457}
body #container #content .menu_holder{background-image:url('../img/big_picture1.jpg');background-position:-50px -290px;height:70px}
body #container #content .menu_holder .headline{position:absolute;color:#ffffff;top:230px;margin-left:20px}
body #container #content .menu_holder .headline h1{font-size:2.8em}
body #container #content .menu_holder .headline h3{color:#b7a457;margin-top:-60px}
body #container #content .menu_holder .headline .button{font-size:2em;font-weight:bold}
body #container #content .menu_holder .menu{float:right;background-color:#333333;padding:0.15em;font-size:1.3em}
body #container #content .menu_holder .menu li{margin-left:1.1em;margin-right:1.1em}
body #container #content .menu_holder .menu li a{text-decoration:none;color:#ffffff}
body #container #content .menu_holder .menu li a:hover{color:#b7a457}
body #container #content .menu_holder .menu li a.active{color:#b7a457}
body #container #content .articles{background-color:black;overflow:auto;padding:2%;text-align:center
}body #container #content .articles #canvas{width:800px;height:600px;background-color:white}
body #container footer{clear:both;background-color:#b7a457;padding:15px;color:#ffffff}
body #container footer .links{text-align:center}
body #container footer .links a{text-decoration:none;color:#ffffff}
li{float:left;list-style:none}
.right{float:right}
.left{float:left}
.eightbit{font-size:1.5em;font-family:disposabledroid}

#container-game{
	text-align: center;
	margin: 0 auto;
	background-color: #4d4d4d;
	min-height: 620px;
	padding-top: 10px;	
}

body #container #content .articles{
	background-color: #333333;
}

.articles hr{
	border-color: #b7a457;
	margin-top: -8px;
	margin-bottom: 10px;	
}

.articles h2.eightbit{
	color:white;
	font-size: 2.8em;
	margin: 0;
	text-align: left;
}

#selector_header {
	color : white;
	font-family:disposabledroid;
	font-size:1.5em;
}

.selector {
	font-weight:bold;
	color : black;
	font-family: disposabledroid;
	background-color: #b7a457 ;
	float : left;
	width : 30%;
	height: 300px;
	margin-left : 2.5%;
	margin-top:20px;
	cursor: pointer;
	border: 1px solid #b7a457;
}

.selector:hover {
	box-shadow: 0 0 8px #c9bb82;
	border: 1px solid #c9bb82;
}

.selector h3{
	color: white;
	font-size: 1.5em;
	margin: 5px;
	
}
.selector h4{
	color: white;
	margin: 5px;
	text-align: center;
	font-size: 1.1em;
	background-color: #c9bb82;
}
.selector:hover h4{
	
	
}

.game_intro {
	height: 260px;
	position: relative;
	overflow: hidden;
}
.game_intro > p {

	position: absolute;
	top: 0;
	left: 0;
    	padding: 10px;
	color: white;
	font-family:disposabledroid;
	font-size: 1.5em;

    	-moz-transition:  opacity 0.5s ease-out; 
	-o-transition: opacity 0.5s ease-out; 
	-webkit-transition: opacity 0.5s ease-out; 
	-ms-transition: opacity 0.5s ease-out; 

	-webkit-animation: moveSlideshow 30s linear forwards;
	-moz-animation:    moveSlideshow 30s linear forwards;
}
.game_intro .textend{
	position: relative;
	margin-top: 430px;
	font-size: 7em;
	text-align:center;

}
@-webkit-keyframes moveSlideshow {
    	0% { top: 0; }
    	100% { top: -370px; }
}
@-moz-keyframes moveSlideshow {
	0% { top: 0; }
	100% { top: -370px; }
}
